<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1,user-scalable=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp"/>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="HandheldFriendly" content="true">
<meta name="MobileOptimized" content="320">
<meta name="screen-orientation" content="portrait">
<meta name="x5-orientation" content="portrait">
<meta name="full-screen" content="yes">
<meta name="x5-fullscreen" content="true">
<meta name="browsermode" content="application">
<meta name="x5-page-mode" content="app">
<meta name="msapplication-tap-highlight" content="no">
<title></title>
<link rel="stylesheet" type="text/css" href="/layui/css/layui.css"  media="all">
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<link rel="stylesheet" href="/groupbuying/css/index.css"/>
<link rel="stylesheet" type="text/css" href="/css/mobiscroll.custom.min.css" />
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<script type="text/javascript" src="/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/mobiscroll.custom.min.js"></script>
<script type="text/javascript" src="/js/layui-post.js"></script>
<style>
.layui-tab{margin:0;}
.layui-tab-title li {width: 50%;padding: 0;background: #dedada;}
.layui-tab-title .layui-this {background: #FFF;}
.cartpay .addr:before {top: 15px;}
.pay-mu{margin-bottom: 10px;}
</style>
</head>
<body style="background: #f2f2f2;">
<nav class="navbar index-nav">
    <div class="loca ng-scope title-order" style="background: #f9fafd;">
        <a class="title-top" href="javascript:window.history.back();"></a>
        <a class="title-center">支付拼团</a>
        <a class="title-right" href="/index"></a>
    </div>
</nav>
<div id="user-b">
    <!-- 支付拼团 -->
    <div class="pay-box">
    <!-- 收货地址信息 -->
    <div class="pay-m pay-site" style="height: auto;">
        <div class="cartpay ng-scope">
            <div class="take-delivery white-color" style="border-radius: 10px 10px 10px 10px;">
                <div class="layui-tab" lay-filter="sendTypes">
                    <ul class="layui-tab-title" style="border-radius: 10px 10px 0 0;">
                        <li class="layui-this" lay-id="1" style="border-radius: 10px 0 0 0;">外面配送</li>
                        <li lay-id="2" style="border-radius: 0 10px 0 0;">到店自取</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <div id="sendMethod">
                                <div id="defaultAddress"></div>
                                <div class="send-type">
                                    <span style="width:20%;float:left;margin-left:30px;color:#666;font-size:14px">配送方式：</span>
                                    <select style="width:70%;float:left;" class="input remark ng-pristine ng-untouched ng-valid ng-empty" id="sendType"></select>
                                </div>
                            </div>
                            <div id="writeAddress" class="ng-hide" style="background:#fff;height: 70px;">
                                <div style="height: 5px;"></div>
                                <a style="border-radius: 10px;width: revert;" class="btn btn-default add_addr" onclick="addressAdd()">添加收货地址</a>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div style="color: #6b6868; font-weight: bold;font-size: 17px;padding: 10px;">河南信阳市罗山县宝城街道办事处行政中路233号 美味鸡蛋仔</div>
                            <div style="height: 80px;padding: 10px;line-height: 40px;">
                                <div style="width: 30%;height: 80px;float:left;">
                                    <div class="section">
                                        <label>自取时间</label>
                                        <input type="text" class="layui-input" id="sendTime" style="width: 65px;display: inline;border: none;" />
                                        <i class="layui-icon layui-icon-right"></i>
                                    </div>
                                </div>
                                <div style="width: 2.5%;height: 70px;margin-top:10px;float:left;margin-right: 3%; border-right: 0.1px solid #ebe4e4;"></div>
                                <div style="width: 64%;height: 80px;float:left;">
                                    <div>预留电话</div>
                                    <div><input id="telPhone" type="number" class="layui-input" placeholder="请输入预留电话" style="width: 60%;border:none;display: inline;"><i class="layui-icon layui-icon-edit"></i></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 商品详情 -->
    <div class="pay-m mc-sum-box"></div>
    <!-- 运费以及总价 -->
    <div class="pay-freight text-right"></div>
    <!-- 支付方式 -->
    <div class="pay-m">
        <div class="am-g">
            <div class="pay-mu">
                <div class="pay-input-group pay-input-group-success">
                    <span class="pay-input-group-label" style="border-radius: 10px 0 0 10px;">
                        <input type="radio" name="doc-radio-1" value="option1" checked>
                    </span>
                    <div class="pay-manner" style="border-radius: 0 10px 10px 0;">微信支付</div>
                </div>
            </div>
<!--            <div class="pay-mu">-->
<!--                <div class="pay-input-group pay-input-group-secondary">-->
<!--                    <span class="pay-input-group-label">-->
<!--                        <input type="radio" name="doc-radio-1" value="option2">-->
<!--                    </span>-->
<!--                    <div class="pay-manner pay-manner2">支付宝支付</div>-->
<!--                </div>-->
<!--            </div>-->
        </div>
        <button class="btn" id="submit" style="height: 40px;border-radius: 10px;">立即支付</button>
    </div>
    <!--拼团玩法-->
    <div class="step">
        <div class="step_hd">
            拼团玩法<!--<a class="step_more" href="tuan_rule.html">查看详情</a>-->
        </div>
        <div id="footItem" class="step_list">
            <div class="step_item">
                <div class="step_num">1</div>
                <div class="step_detail"><p class="step_tit">选择<br>心仪商品</p></div>
            </div>
            <div class="step_item step_item_on">
                <div class="step_num">2</div>
                <div class="step_detail"><p class="step_tit">支付开团<br>或参团</p></div>
            </div>
            <div class="step_item">
                <div class="step_num">3</div>
                <div class="step_detail">
                    <p class="step_tit">等待好友<br>参团支付</p>
                </div>
            </div>
            <div class="step_item">
                <div class="step_num">4</div>
                <div class="step_detail"><p class="step_tit">达到人数<br>团购成功</p></div>
            </div>
        </div>
    </div>
</div>
</div>
<input type="hidden" id="addressId">
</body>
<script type="text/javascript">
$.ajaxSetup({contentType: "application/json; charset=utf-8"});
var userInfo = $.parseJSON(sessionStorage.getItem("userInfo")),enumsData=[];
var payMoney = 0,goodsId,sendType = 1;
var theme = "ios",mode = "scroller",display = "bottom",lang="zh";
var loading,isJoinUrl = false;//是否是通过分享链接进入
layui.use(['layer','form','element','util'], function(){
    // layui.util.fixbar({
    //     top:true,css: { right: 15, bottom: 105 },showHeight:100,
    //     click: function (type) {if (type === 'top') $('.layui-fluid').animate({scrollTop: 0}, 200);}
    // });
    loading = layer.load(0, {shade: 0.1});
    $.post(geturl()+'/enums/select?token='+sessionStorage.getItem("token"), JSON.stringify({parentEnumCode:"DELIVERY_TYPE",orderByAscType:"enumCode"}), function (res) {
        for(var key in res.data.DELIVERY_TYPE) $('#sendType').append('<option value="'+key + '">' + res.data.DELIVERY_TYPE[key] + '</option>');
        $('#sendType').val("DELIVERY_TYPE_03").attr("disabled",true)
    })
    layui.element.on('tab(sendTypes)', function(){
        sendType = this.getAttribute('lay-id');
    });
    //获取地址信息
    getAddress({userId:userInfo.userId,isDefault:1,isDel:0})
    var nowDate = minDate().split(",")
    $("#sendTime").val((nowDate[3].length==1?"0"+nowDate[3]:nowDate[3])+":"+(nowDate[4].length==1?"0"+nowDate[4]:nowDate[4]))
    $('#sendTime').mobiscroll().time({
        theme: theme,
        mode: mode,
        display: display,
        lang: lang,
        minDate:new Date(parseInt(nowDate[0]),parseInt(nowDate[1]),parseInt(nowDate[2]),parseInt(nowDate[3]),parseInt(nowDate[4])),
        maxDate:new Date(parseInt(nowDate[0]),parseInt(nowDate[1]),parseInt(nowDate[2]),22,0)
    });
    $.post("/cateringGroupActivities/select",JSON.stringify({sysId:getQueryString("actiId")}), function (res) {
        layer.closeAll()
        $(".am-slides").empty()
        for(var i in res.data){
            payMoney = res.data[i].actiPrice;
            goodsId = res.data[i].goodsId;
            if(!isEmpty(getQueryString("actiId"))) isJoinUrl = true
            $(".mc-sum-box").append(
                '<div class="myorder-sum fl"><img src="'+res.data[i].goodsImg+'"></div>' +
                '<div class="myorder-text">' +
                '<h1>'+res.data[i].goodsName+' </h1>' +
                '<h2>份量：'+res.data[i].goodsWeight+'</h2>' +
                '<div class="myorder-cost">' +
                '<span>数量：1</span>' +
                '<span class="mc-t">￥'+res.data[i].actiPrice+'/份</span>' +
                '</div>' +
                '</div>'
            )
            $(".pay-freight").append(
                '<p>配送费:&nbsp;<span>￥0.00</span>&nbsp;总价:&nbsp;&nbsp;<b>'+res.data[i].actiPrice+'</b></p>'
            )
        }
    })
})
$("#submit").click(function(){
    if(sendType == 1 && isEmpty($("#addressId").val())){
        layer.msg("请添加或选择收货地址",{icon:0,time:1000})
        $("#telPhone").val("")
        $("#sendTime").val("")
    }else if(sendType == 2 && isEmpty($("#telPhone").val())){
        layer.msg("请输入自取预留电话",{icon:0,time:2000})
        $("#addressId").val("")
    }else{
        if(sendType == 1){
            $("#telPhone").val("")
            $("#sendTime").val("")
        }else{
            $("#addressId").val("")
        }
        if(isJoinUrl){
            // 如果不是从分享链接进入，则查询是否有开团记录，根据状态设置参数次数。目前参数为活动限一次
            $.post("/cateringGroupBuying/select",JSON.stringify({userId:userInfo.userId,activity_id:getQueryString("actiId"),status:"1<->2"}),function(res){
                if(res.data.length == 0) toPay()
                else layer.msg("已开团，请勿重复开团！",{icon:0,time:2000})
            })
        }else{
            // 如果是从分享链接进入，则查询是有订单记录，根据状态设置参数次数。目前参数为活动限一次
            $.post("/cateringGroupOrders/select",JSON.stringify({userId:userInfo.userId,groupBuyingId:getQueryString("groupBuyingId"),payStatus:"0<->1"}),function(res){
                if(res.data.length == 0) toPay()
                else layer.msg("已参团，请勿重复参团！",{icon:0,time:2000})
            })
        }
    }
})

function toPay(){
    var url = getHttp()+"/wxpay/pay/cateringptpay.html?shopMoney="+parseInt(payMoney/1*100)+"&userId="+userInfo.userId+"&opendId="+sessionStorage.getItem("opendId")+"&actiId="+getQueryString("actiId")+"&goodsId="+goodsId+"&addressId="+$("#addressId").val()+"&sendType="+sendType+"&sendTime="+$("#sendTime").val()+"&sendPhone="+$("#telPhone").val()+"&groupBuyingId="+getQueryString("groupBuyingId");
    var appid = "wx1c9f69395c9b34ec";
    url = encodeURIComponent(url);
    window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid="+appid+"&redirect_uri=" + url + "&response_type=code&scope=snsapi_userinfo&state=shzz_portal_push#wechat_redirect";
}

function getAddress(data){
    $.post("/cateringAddress/select",JSON.stringify(data),function(res){
        $("#defaultAddress").html("")
        layer.close(loading)
        if(res.data.length === 0) {
            $("#writeAddress").removeClass("ng-hide")
            $("#sendMethod").addClass("ng-hide")
        }
        for(var i in res.data){
            $("#addressId").val(res.data[i].sysId)
            $("#telPhone").val(res.data[i].telPhone)
            $("#defaultAddress").append(
                '<div class="addr" onclick="chooseAddress()" style="padding: 10px 20px 0px 30px;">' +
                '<p style="color:#FA2C2A;line-height: 30px;height: 30px; font-size: 16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;" class="ng-binding">'+res.data[i].person+'  '+'  '+res.data[i].detail+'  '+res.data[i].telPhone+'</p>' +
                '<p class="edit"><a onclick="chooseAddress()">&nbsp;</a></p>' +
                '</div>' +
                '<div class="yujibox">' +
                '<div style="width:25%;float:left;margin-left:30px;color:#666;font-size:14px">送达时间：</div>' +
                '<div style="width:60%;float:left;color:#888;font-size:12px">预计30分钟</div>' +
                '</div>' +
                '<div class="remarkbox">' +
                '<span style="width:20%;float:left;margin-left:30px;color:#666;font-size:14px">备注：</span>' +
                '<input id="remark" class="input remark ng-pristine ng-untouched ng-valid ng-empty" placeholder="点此输入备注" type="text">' +
                '</div>'
            )
        }
    })
}

function getAddressId(id){
    $("#addressId").val(id)
    //更新地址信息
    getAddress({sysId:id,isDel:0})
}

function addressAdd(){
    parent.layer.open({
        type:2,
        area: ['100%', '100%'],
        title:["新增收货地址", 'text-align:center;font-size: 16px; font-weight: bold;padding-left: 50px;'],
        closeBtn:1,
        btnAlign: 'c',
        offset: 'b',
        anim: 0,
        skin:'layui-layer-nobg',
        shadeClose:true,
        content:"/addressadd",
        scrollbar:false,
    })
}
function chooseAddress(){
    layer.open({
        type:2,
        area: ['100%', '50%'],
        title:["选择收货地址", 'text-align:center;font-size: 16px; font-weight: bold;'],
        closeBtn:1,
        btnAlign: 'c',
        offset: 'b',
        anim: 2,
        skin:'layui-layer-nobg',
        shadeClose:true,
        content:"/addresscho?addressId="+$("#addressId").val(),
        scrollbar:false,
    })
}
//最小日期（当前日期）当前时间半小时后
function minDate(){
    var now = new Date();
    now.setMinutes(now.getMinutes() + 31);
    return now.getFullYear()+","+(now.getMonth()+1)+","+(now.getDay())+","+(now.getHours()) + ',' + (now.getMinutes())
}
</script>
</html>